
<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="layout" content="portalForAppTemplate"/>
    <title>免费评房</title>
</head>

<body>
<nav class="nav">
   %{--<a href="/portalForApp/login?externalId=${this?.contact?.externalId}&fullName=${this?.contact?.fullName}&cellphone=${this?.contact?.cellphone}"><</a>--}%
    <g:link controller="portalForApp" action="login" params="[externalId:this.contact?.externalId,cellphone:this.contact?.cellphone,fullName:this.contact?.fullName]"><</g:link>
    填写小区信息
</nav>
<header class="create-header">
    <ul class="creat-flowList flex-box">
        <li data-id="01" class="flex1 active">
            <span></span>

            <h3>小区信息</h3>
        </li>
        <li data-id="02" class="flex1 line">
            <span></span>

            <h3>押品信息</h3>
        </li>
        <li data-id="03" class="flex1 line">
            <span></span>

            <h3>极速询值</h3>
        </li>
    </ul>
</header>

<div class="AutoCreat">
    <form action="create2Step2" id="Create2Form1" method="post" class="Create2Form1">
        <input type="hidden" value="${this.contactId}" name="contactId"  id="contactId"/>

        <div class="bgcWhite Create weui_cells weui_cells_form">
            <div class="weui_cell weui_cell_select pl-15">
                <div class="weui_cell_hd"><label class="weui_label">所在城市</label></div>

                <div class="weui_cell_bd weui_cell_primary">
                    <g:select class="weui_select" name="city" id="city" optionKey="id" optionValue="name"
                              from="${this.cityList}" value="${this.house?.city}"/>
                </div>
            </div>

            <div class="weui_cell weui_cell_select pl-15">
                <div class="weui_cell_hd"><label class="weui_label">所在区县</label></div>

                <div class="weui_cell_bd weui_cell_primary">
                    <select class="weui_select" name="district" id="district">
                    </select>
                </div>
            </div>

            <div class="weui_cell">
                <div class="weui_cell_hd"><label class="weui_label">小区名称</label></div>

                <div class="weui_cell_bd weui_cell_primary">
                    <g:textField class="weui_input" type="text" id="projectName" name="projectName"
                                 value="${this.house?.projectName}" placeholder="如：花家地西里一区" autocomplete="off"/>
                </div>
            </div>
        </div>

        <div class="bigBtn">
            <button type="button" class="linkBtn weui_btn weui_btn_plain_default" id="createStep1Btn">下一步</button>
        </div>
    </form>
</div>
%{--<div class="client-hotline2">--}%
    %{--<a href="tel:${com.next.ContactLoginCertificate.findByExternalId(openId)?.contact?.city?.telephone}"--}%
       %{--class="hotline">--}%
        %{--<g:img class="hotlineIcon" dir="images" file="hotline-icon.png"/>--}%
        %{--<span class="city-hotline">${com.next.ContactLoginCertificate.findByExternalId(openId)?.contact?.city?.telephone}</span>--}%
    %{--</a>--}%
%{--</div>--}%

%{--提示信息和验证--}%
<div class="message-box" style="top: 20%;">
    <div class="helpMsg hide"></div>
    <g:if test="${flash.message}">
        <div class="message" role="status">
            ${flash.message}
        </div>
    </g:if>
</div>
<script>

    $(function () {
        function getDistrict() {
            $.ajax({
                type: "POST",
//                url: "https://" + window.location.host + "/wechatOpportunity/wxGetDistrictByCity",
                url: "/portalForApp/getDistrictByCity",
                data: {
                    city: $("#city").val(),
                },

                success: function (data) {
                    var dataList = data.districtList;
                    var option;
                    if (data.status == "success") {
                        $('#district').html("");
                        for (var i = 0; i < dataList.length; i++) {
                            option = '<option value="' + dataList[i] + '">' + dataList[i] + '</option>';
                            $("#district").append(option)
                        }
                    }
                },
                error: function () {
                    helpMessage("区县获取失败，请稍后重试");
                }
            });
        }

        getDistrict();
        // 动态获取县区
        $("#city").change(function () {
            getDistrict();
        });

        $("#createStep1Btn").click(function () {
            var district = $("#district").val();
            if (!district) {
                helpMessage("请输入所属区县");
                return;
            }

            var projectName = $("#projectName").val();
            if (!projectName) {
                helpMessage("请输入小区名称");
                return;
            }

            $("#Create2Form1").submit();
            $(this).css("cssText", "background-color:#ccc !important;");
        });

        function helpMessage(message) {
            $(".helpMsg").text(message).fadeIn(200);
            setTimeout(function () {
                $(".helpMsg").fadeOut(200);
            }, 2000);
        }
    })

</script>
</body>
</html>
